<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>购物车</title>
</head>
<link rel="stylesheet" href="../static/libs/css/cart.css">
<link rel="stylesheet" href="../static/libs/css/reset.css">
<link rel="stylesheet" href="../static/libs/css/login/bootstrap.css">
<link rel="stylesheet" href="../static/libs/css/commect.css">
<style>
    .footer-box {
        background: #fff;
    }
    
    .footer-box .copyright {
        font-size: 12px;
        color: #7f7f7f;
        padding: 30px 0 30px 0;
    }
    
    .container {
        position: relative;
        width: 1200px;
        margin: 0 auto;
        text-align: center;
    }
    
    #logout {
        position: absolute;
        left: 220px;
        top: 0;
        display: none;
    }
    
    .header-box {
        top: -20px;
        position: relative;
        z-index: 1000;
        height: 0;
    }
</style>

<body>
    <div class="cart-container">
        <header class="header-box">
            <aside class="top-bar">
                <div class="container">
                    <div class="welcome-div">

                        <span><em class="userinfo"></em> 您好,欢迎来到罗技官方商城&nbsp;&nbsp;&nbsp;</span>

                        <a href="./login.html" id="btnlogin">请登录</a><span id="gang">&nbsp;|&nbsp;</span><a href="./Registration.html" id="btnregistered">注册</a>
                        <a href="javascript:void(0)" id="logout">[ 注销登录 ]</a>
                    </div>
                    <div class="right-tool">
                        <a class="user-a" href="#"><i class="icon-account"></i>我的账户</a>
                        <span class="f-l">|</span>
                        <div class="user-cart">
                            <a class="user-a" href="./gouwuche.html" target="_blank">
                                <i class="icon-cart">
                            <em class="number" id="txtTopNumber">0</em>
                        </i>购物车
                            </a>
                        </div>

                        <span class="phone" style="font-size: 20px;"><i style="margin-top: -5px;"></i>售前4006260228</span>
                        <span class="phone" style="font-size: 20px;"><i style="margin-top: -5px;"></i>售后4006137015</span>
                    </div>
                </div>
            </aside>
        </header>
        <div class="cart-header">
            <a class="logo" href="./logitech.html"></a>
            <div class="step-box"></div>
        </div>
        <div class="page-cart-no" id="NoShoppingProduct" hidden="hidden" style="display: none;">
            <div class="page-cart-container">

                <!--提示 start-->
                <div class="page-cart-no-info">
                    <p class="p1">您的购物车还是空的</p>
                    <p class="p2">
                        <a class="no-btn" href="./productDetails.html">去逛逛</a><br>
                    </p>
                </div>
            </div>
        </div>
        <!--提示 end-->
        <div id="YesShoppingProduct" hidden="hidden" style="display: block;">
            <div class="cart-name-title"><span class="page-title">购物车</span><span class="Free" style="margin-left: 5%;">您还差99元包邮，点击<a href="#">积分兑换包邮卡</a>或点击<a href="#">凑单</a> </span><span id="cartShowLogin" style="display: none;">现在 <a href="javascript:void(0)"  id="login">登录</a> ，您购物车的 商品将被永久保存</span></div>
            <div class="pay-container cart-table-box">
                <table class="cart-table" id="ShoppingCartList">
                    <tbody>
                        <tr>
                            <th class="first" colspan="2"> <span class="line">        <label class="mn-check check-all" ">全选</label>        <span class="tooltip-span cFreight" style="display:none;">还差元包邮 <a class="together-a" href="javascript:void(0);">凑单</a></span> </span>
                            </th>
                            <th width="140"><span class="line">单价</span></th>
                            <th width="140"><span class="line">数量</span></th>
                            <th width="140"><span class="line">合计</span></th>
                            <th width="140"><span class="line">操作</span></th>
                        </tr>
                    </tbody>
                    <tbody class="sp">

                    </tbody>
                </table>
            </div>
            <!--价格 start-->
            <div class="cart-all-price-box">
                <em class="left-bg"></em>
                <div class="div-text">
                    <p><span style="display: none;">运费<i>￥</i><i style="padding-left: 0px;">0</i></span><span>商品金额<i>￥</i><i id="sumProductPrice" style="padding-left: 0px;">0</i></span></p>
                </div>
                <div class="price-content">
                    <span class="check-label-all">
                        <label class="mn-check  check-all">全选</label>
                    </span>
                    <span class="check-all-tool">
                        <a class="delete-all" href="javascript:void(0)">批量删除</a>
                        <a class="delete-clear" href="javascript:void(0)">清空购物车</a>
                    </span>
                    <div class="check-all-right">
                        <span class="check-all-info" style="display: none;">
                            <em class="cFreight">
                                还差元包邮 <a class="together-a" href="javascript:void(0);">
                                    凑单
                                </a>
                            </em>
                        </span>
                        <span class="check-all-price">
                            <em>商品总价</em>
                            <strong style="float: left">￥</strong> <strong style="float: right" id="SOPrice">0</strong>
                        </span>
                        <span class="check-all-price" style="margin-left: 10px;">
                            <em>所需积分</em>
                            <strong style="float: right" id="SumPointAmt">0</strong>
                            <strong style="float: right; display: none;" id="SumPointAmts">0</strong>
                        </span>
                        <a id="sureOrder" class="wg-btn orange-btn sure-result" href="javascript:void(0);">确认结算</a>
                    </div>
                </div>
                <div style="width: 100%; text-align: right; margin-top: 8%;">
                    <span class="Free">您还差99元包邮，点击<a href="#">积分兑换包邮卡</a>或点击<a href="#">凑单</a> </span>
                </div>
                <em class="right-bg"></em>
                <a class="give-advise" href="javascript:;"></a>
            </div>
            <!--价格 end-->
        </div>

    </div>


    <footer class="footer-box">
        <aside>
            <div class="container copyright">
                <p>罗技官方商城由罗技（中国）科技有限公司授权双齐国际贸易（上海）有限公司负责经营 2017 , all rights reserved</p>
                <p>罗技官方网站 联系方式 隐私声明 用户服务协议 沪ICP备12002604号-1</p>
            </div>
            <div class="container copyright" style="padding: 0px 0px 0px 0px">
                <script type="text/javascript">
                    var cnzz_protocol = (("https:" == document.location.protocol) ? " http://" : " https://");
                    document.write(unescape("%3Cspan id='cnzz_stat_icon_1254611721'%3E%3C/span%3E%3Cscript src='" + cnzz_protocol + "s95.cnzz.com/stat.php%3Fid%3D1254611721%26show%3Dpic' type='text/javascript'%3E%3C/script%3E"));
                </script><span id="cnzz_stat_icon_1254611721"></span>
                <script src=" http://s95.cnzz.com/stat.php?id=1254611721&amp;show=pic" type="text/javascript"></script>
                <script src="/Scripts/cookie_js/tongji.js?time=20190308-1"></script>
            </div>
        </aside>
    </footer>
</body>
<script src="../static/libs/javascripts/jquery-1.11.1.min.js"></script>
<script src="../static/libs/javascripts/cookie.js"></script>
<script src="../static/libs/javascripts/jQuery.js"></script>
<script src="../static/libs/javascripts/jquery.lazyload.js"></script>
<script src="../static/libs/javascripts/ajax.js"></script>
<script src="./javascripts/nav.js"></script>
<script src="./javascripts/cart.js"></script>
<script src="./javascripts/goodslist.js"></script>
<script src="./javascripts/index.js"></script>
<script>
    function getId() {
        return location.hash.split("=")[1]
    }
    window.onload = function() {
        ajax({
            url: "http://127.0.0.1:8888/cart/add" + getId(),
            callback: render
        })
    }
</script>

</html>